<template>
    <div>
        <Header  title="优惠卷查询"></Header>
        <div class='content'>
            <div class='title'>
                待转换的链接
            </div>
            <textarea id="value" cols="30" rows="10" v-model="value"></textarea>
        </div>
        <Button  type="primary" class='btn' @click="submit()" :style="'background-color:'+value?'#ff5400':'#b9b9b9'">查询</Button>
        <MyTabbar :selected="'优惠卷查询'"></MyTabbar>
    </div>
</template>
<script>
import MyTabbar from "../components/MyTabbar.vue";
import axios from "axios";
import { Header ,Toast ,Button,MessageBox } from 'mint-ui';
import { Indicator } from 'mint-ui';
export default {
    components: {
        Header ,Button,MyTabbar
    },
    data(){
        return {
            value: '',
        }
    },
    methods: {
        submit(){
            if(!this.value){
                Toast("请输入淘口令！");
                return ;
            }
            Indicator.open({spinnerType:'triple-bounce'});
            var _this = this;
            axios.get('/taobao/tpwdParse?password=' + this.value).then(function(res){
                Indicator.close();
                _this.value = '';
                let data = res.data;
                console.log(data);
                if(data.code === -1){
                    let message = '该商家太抠了，没有设置荭包优惠券，建议跳转查询其他同款宝贝~';
                    MessageBox.confirm(message).then(action => {
                        _this.$router.push({ name:'search', query: {keyword: data.message}})
                    });
                }

                if(data.code !== 0){
                    Toast(data.message);
                    return ;
                }

                let message = data.data;
                MessageBox.confirm(message).then(action => {
                    _this.copyToClip(message,'复制成功,请打开淘宝领取优惠卷');
                });
            });
        },
        copyToClip(content, message) {
            var aux = document.createElement("input"); 
            aux.setAttribute("value", content); 
            document.body.appendChild(aux);
            aux.select();
            document.execCommand("copy"); 
            document.body.removeChild(aux);
            if (message == null) {
                Toast("复制成功");
            } else{
                Toast(message);
            }
        },
        setRem() {
            var docEl = document.documentElement;
            var clientWidth = docEl.clientWidth;
            if (!clientWidth) {
                return;
            }
            docEl.style.fontSize = 145 * (clientWidth / 1080) + 'px';
        }
    },
    created(){
        this.setRem();
    },
    
}
</script>
<style>
.wrap{
    position: fixed;
    width: 100%;
    bottom: 0;
}
.mint-header {
    background-color: #ff5300;
}
.content{
    width: 85%;
    display: inline-block;
    background-color: white;
    padding: 5%;
    border-radius: 10px;
    margin: 20px 0;
}
.title {
    text-align: left;
    padding-bottom: 10px;
    position: relative;
    font-size: .3rem;
}
.clear{
    position: absolute;
    right: 0;
    color: #e2e2e299;
    font-size: 12px;
}
.btn{
    width: 70%;
    padding: 0 .3rem;
    background-color: #ff5300;
    border-radius: 2rem;
    border: 0;
    color: white;
}
#value{
    width: 100%;
    border-radius: 5px;
    border: 1px solid #d8d7d7;
    background-color: #e2e2e299;
}
</style>